<template>
  <div>
    <div v-if="authority">
    <code>
      <svg-icon icon-class="message" style="margin-right:10px;color:red;font-size:20px;"></svg-icon>
              备注说明：如果第一级分成设置为0，那么第二级第三级不享受分成,如果第二级分成设置为0，那么第三级不享受分成
    </code>
    <el-form class="form-container" :model="postForm" :rules="rules" v-loading="formLoading" ref="postForm"
             label-width="300px" label-position="right">
      <div class="boder-bottom">
        <el-form-item label="升级会员第一级抽成比例(单位%)：" prop="upgradeMembershipL1Ratio">
          <el-input v-model="postForm.upgradeMembershipL1Ratio" placeholder="升级会员第一级抽成比例"
                    style="width: 230px"></el-input>
        </el-form-item>
        <el-form-item label="升级会员第二级抽成比例(单位%)：" prop="upgradeMembershipL2Ratio">
          <el-input v-model="postForm.upgradeMembershipL2Ratio" placeholder="升级会员第二级抽成比例"
                    style="width: 230px"></el-input>
        </el-form-item>
        <el-form-item label="升级会员第三级抽成比例(单位%)：" prop="upgradeMembershipL3Ratio">
          <el-input v-model="postForm.upgradeMembershipL3Ratio" placeholder="升级会员第三级抽成比例"
                    style="width: 230px"></el-input>
        </el-form-item>
        <el-form-item label="升级会员代理商奖学金比例(单位%)：" prop="upgradeAgentRatio" v-if="this.agentLevel > 0">
          <el-input v-model="postForm.upgradeAgentRatio" placeholder="升级会员代理商奖学金比例" style="width: 230px"></el-input>
        </el-form-item>
        <el-form-item label="升级会员合伙人奖学金比例(单位%)：" prop="upgradePartnerRatio" v-if="this.agentLevel > 1">
          <el-input v-model="postForm.upgradePartnerRatio" placeholder="升级会员合伙人奖学金比例" style="width: 230px"></el-input>
        </el-form-item>
        <el-form-item label="升级会员分公司奖学金比例(单位%)：" prop="upgradeBranchRatio" v-if="this.agentLevel > 1">
          <el-input v-model="postForm.upgradeBranchRatio" placeholder="升级会员分公司奖学金比例" style="width: 230px"></el-input>
        </el-form-item>
      </div>
      <div class="boder-bottom">
        <el-form-item label="升级SVIP第一级抽成比例(单位%)：" prop="upgradeSvipL1Ratio">
          <el-input v-model="postForm.upgradeSvipL1Ratio" placeholder="升级SVIP第一级抽成比例"
                    style="width: 230px"></el-input>
        </el-form-item>
        <el-form-item label="升级SVIP第二级抽成比例(单位%)：" prop="upgradeSvipL2Ratio">
          <el-input v-model="postForm.upgradeSvipL2Ratio" placeholder="升级SVIP第二级抽成比例"
                    style="width: 230px"></el-input>
        </el-form-item>
        <el-form-item label="升级SVIP第三级抽成比例(单位%)：" prop="upgradeSvipL3Ratio">
          <el-input v-model="postForm.upgradeSvipL3Ratio" placeholder="升级SVIP第三级抽成比例"
                    style="width: 230px"></el-input>
        </el-form-item>
        <el-form-item label="升级SVIP代理商奖学金比例(单位%)：" prop="upgradeAgentRatio" v-if="this.agentLevel > 0">
          <el-input v-model="postForm.upgradeSvipAgentRatio" placeholder="升级SVIP代理商奖学金比例" style="width: 230px"></el-input>
        </el-form-item>
        <el-form-item label="升级SVIP合伙人奖学金比例(单位%)：" prop="upgradePartnerRatio" v-if="this.agentLevel > 1">
          <el-input v-model="postForm.upgradeSvipPartnerRatio" placeholder="升级SVIP合伙人奖学金比例" style="width: 230px"></el-input>
        </el-form-item>
        <el-form-item label="升级SVIP分公司奖学金比例(单位%)：" prop="upgradeBranchRatio" v-if="this.agentLevel > 1">
          <el-input v-model="postForm.upgradeSvipBranchRatio" placeholder="升级SVIP分公司奖学金比例" style="width: 230px"></el-input>
        </el-form-item>
      </div>
      <div class="boder-bottom">
        <el-form-item label="课程购买第一级抽成比例(单位%)：" prop="buyCourseL1Ratio">
          <el-input v-model="postForm.buyCourseL1Ratio" placeholder="课程购买第一级抽成比例" style="width: 230px"></el-input>
        </el-form-item>
        <el-form-item label="课程购买第二级抽成比例(单位%)：" prop="buyCourseL2Ratio">
          <el-input v-model="postForm.buyCourseL2Ratio" placeholder="课程购买第二级抽成比例" style="width: 230px"></el-input>
        </el-form-item>
        <el-form-item label="课程购买第三级抽成比例(单位%)：" prop="buyCourseL3Ratio">
          <el-input v-model="postForm.buyCourseL3Ratio" placeholder="课程购买第三级抽成比例" style="width: 230px"></el-input>
        </el-form-item>
        <el-form-item label="课程购买代理商奖学金比例(单位%)：" prop="buyCourseAgentRatio" v-if="this.agentLevel > 0">
          <el-input v-model="postForm.buyCourseAgentRatio" placeholder="课程购买代理商奖学金比例" style="width: 230px"></el-input>
        </el-form-item>
        <el-form-item label="课程购买合伙人奖学金比例(单位%)：" prop="buyCoursePartnerRatio" v-if="this.agentLevel > 1">
          <el-input v-model="postForm.buyCoursePartnerRatio" placeholder="课程购买合伙人奖学金比例" style="width: 230px"></el-input>
        </el-form-item>
        <el-form-item label="课程购买分公司奖学金比例(单位%)：" prop="buyCourseBranchRatio" v-if="this.agentLevel > 1">
          <el-input v-model="postForm.buyCourseBranchRatio" placeholder="课程购买分公司奖学金比例" style="width: 230px"></el-input>
        </el-form-item>
      </div>
      <el-form-item v-if="permission == 3" style="padding: 10px 0">
        <el-button type="primary" v-loading="btnLoading" icon="el-icon-check" @click="submitForm">保存</el-button>
      </el-form-item>
    </el-form>
    </div>
    <authority v-else></authority>
  </div>
</template>

<script>
  import { getCommissionRatio, saveCommissionRatio } from '@/api/basicDatum'
  import { shopManage_basicDatum, getAgentLevels } from '@/utils/permission'
  const postForm = {
    upgradeMembershipL1Ratio: null,
    upgradeMembershipL2Ratio: null,
    upgradeMembershipL3Ratio: null,
    upgradeAgentRatio: null,
    upgradePartnerRatio: null,
    upgradeBranchRatio: null,
    buyCourseL1Ratio: null,
    buyCourseL2Ratio: null,
    buyCourseL3Ratio: null,
    buyCourseAgentRatio: null,
    buyCoursePartnerRatio: null,
    buyCourseBranchRatio: null,
    upgradeSvipL1Ratio: null,
    upgradeSvipL2Ratio: null,
    upgradeSvipL3Ratio: null,
    upgradeSvipAgentRatio: null,
    upgradeSvipPartnerRatio: null,
    upgradeSvipBranchRatio: null
  }

  const validateNumber = (rule, value, callback) => {
    if (value && isNaN(value)) {
      callback('请输入正确的比例')
    } else {
      if (value < 0 || value > 100) {
        callback('请输入正确的比例')
      }
      callback()
    }
  }

  const rules = {
    upgradeMembershipL1Ratio: [{ validator: validateNumber, trigger: 'blur' }],
    upgradeMembershipL2Ratio: [{ validator: validateNumber, trigger: 'blur' }],
    upgradeMembershipL3Ratio: [{ validator: validateNumber, trigger: 'blur' }],
    upgradeAgentRatio: [{ validator: validateNumber, trigger: 'blur' }],
    upgradePartnerRatio: [{ validator: validateNumber, trigger: 'blur' }],
    upgradeBranchRatio: [{ validator: validateNumber, trigger: 'blur' }],
    buyCourseL1Ratio: [{ validator: validateNumber, trigger: 'blur' }],
    buyCourseL2Ratio: [{ validator: validateNumber, trigger: 'blur' }],
    buyCourseL3Ratio: [{ validator: validateNumber, trigger: 'blur' }],
    buyCourseAgentRatio: [{ validator: validateNumber, trigger: 'blur' }],
    buyCoursePartnerRatio: [{ validator: validateNumber, trigger: 'blur' }],
    buyCourseBranchRatio: [{ validator: validateNumber, trigger: 'blur' }],
    upgradeSvipL1Ratio: [{ validator: validateNumber, trigger: 'blur' }],
    upgradeSvipL2Ratio: [{ validator: validateNumber, trigger: 'blur' }],
    upgradeSvipL3Ratio: [{ validator: validateNumber, trigger: 'blur' }],
    upgradeSvipAgentRatio: [{ validator: validateNumber, trigger: 'blur' }],
    upgradeSvipPartnerRatio: [{ validator: validateNumber, trigger: 'blur' }],
    upgradeSvipBranchRatio: [{ validator: validateNumber, trigger: 'blur' }]
  }
  export default {
    data() {
      return {
        permission: 3,
        authority: true,
        postForm: Object.assign({}, postForm),
        rules,
        agentLevel: 0,
        formLoading: false,
        btnLoading: false
      }
    },
    created() {
      this.getModelPermission()
      this.initData()
    },
    methods: {
      getModelPermission() {
        this.permission = shopManage_basicDatum()
      },
      initData() {
        this.agentLevel = getAgentLevels()
        getCommissionRatio().then(res => {
          if (res.data.data) {
            this.postForm = res.data.data
          }
        }).catch(err => {
          console.log(err)
        })
      },
      submitForm() {
        for (const i in this.postForm) {
          if (this.postForm[i] == null || this.postForm[i] == '') {
            this.postForm[i] = 0
          }
        }
        if (parseFloat(this.postForm.upgradeMembershipL1Ratio) == 0) {
          if (parseFloat(this.postForm.upgradeMembershipL2Ratio) != 0 || parseFloat(this.postForm.upgradeMembershipL3Ratio) != 0) {
            this.$message.warning('升级会员第一级抽成比例为0，第二三级也只能为0')
            return
          }
        }
        if (parseFloat(this.postForm.upgradeMembershipL2Ratio) == 0) {
          if (parseFloat(this.postForm.upgradeMembershipL3Ratio) != 0) {
            this.$message.warning('升级会员第二级抽成比例为0，第三级也只能为0')
            return
          }
        }
        if (parseFloat(this.postForm.upgradeSvipL1Ratio) == 0) {
          if (parseFloat(this.postForm.upgradeSvipL2Ratio) != 0 || parseFloat(this.postForm.upgradeSvipL3Ratio) != 0) {
            this.$message.warning('升级SVIP第一级抽成比例为0，第二三级也只能为0')
            return
          }
        }
        if (parseFloat(this.postForm.upgradeSvipL2Ratio) == 0) {
          if (parseFloat(this.postForm.upgradeSvipL3Ratio) != 0) {
            this.$message.warning('升级SVIP第二级抽成比例为0，第三级也只能为0')
            return
          }
        }
        if (parseFloat(this.postForm.buyCourseL1Ratio) == 0) {
          if (parseFloat(this.postForm.buyCourseL2Ratio) != 0 || parseFloat(this.postForm.buyCourseL3Ratio) != 0) {
            this.$message.warning('购买课程第一级抽成比例为0，第二三级也只能为0')
            return
          }
        }
        if (parseFloat(this.postForm.buyCourseL2Ratio) == 0) {
          if (parseFloat(this.postForm.buyCourseL3Ratio) != 0) {
            this.$message.warning('购买课程第二级抽成比例为0，第三级也只能为0')
            return
          }
        }
        this.$refs.postForm.validate(valid => {
          if (valid) {
            console.log('升级会员' + parseFloat(this.postForm.upgradePartnerRatio) + parseFloat(this.postForm.upgradeBranchRatio) + parseFloat(this.postForm.upgradeAgentRatio) + parseFloat(this.postForm.upgradeMembershipL1Ratio) + parseFloat(this.postForm.upgradeMembershipL2Ratio) + parseFloat(this.postForm.upgradeMembershipL3Ratio))

            if (parseFloat(this.postForm.upgradePartnerRatio) + parseFloat(this.postForm.upgradeBranchRatio) + parseFloat(this.postForm.upgradeAgentRatio) + parseFloat(this.postForm.upgradeMembershipL1Ratio) + parseFloat(this.postForm.upgradeMembershipL2Ratio) + parseFloat(this.postForm.upgradeMembershipL3Ratio) > 100) {
              this.$message.warning('升级会员第一、二、三级与代理商、合伙人、分公司的抽成比例不能大于100')
              return
            }
            if (parseFloat(this.postForm.buyCourseBranchRatio) + parseFloat(this.postForm.buyCoursePartnerRatio) + parseFloat(this.postForm.buyCourseAgentRatio) + parseFloat(this.postForm.buyCourseL1Ratio) + parseFloat(this.postForm.buyCourseL2Ratio) + parseFloat(this.postForm.buyCourseL3Ratio) > 100) {
              this.$message.warning('课程购买第一、二、三级与代理商、合伙人、分公司的抽成比例不能大于100')
              return
            }
            console.log('升级svip' + parseFloat(this.postForm.upgradeSvipPartnerRatio) + parseFloat(this.postForm.upgradeSvipBranchRatio) + parseFloat(this.postForm.upgradeSvipAgentRatio) + parseFloat(this.postForm.upgradeSvipL1Ratio) + parseFloat(this.postForm.upgradeSvipL2Ratio) + parseFloat(this.postForm.upgradeSvipL3Ratio))

            if (parseFloat(this.postForm.upgradeSvipPartnerRatio) + parseFloat(this.postForm.upgradeSvipBranchRatio) + parseFloat(this.postForm.upgradeSvipAgentRatio) + parseFloat(this.postForm.upgradeSvipL1Ratio) + parseFloat(this.postForm.upgradeSvipL2Ratio) + parseFloat(this.postForm.upgradeSvipL3Ratio) > 100) {
              console.log('超过100')
              this.$message.warning('升级svip会员第一、二、三级与代理商、合伙人、分公司的抽成比例不能大于100')
              return
            }
            if (this.btnLoading) {
              return
            }
            this.btnLoading = true
            this.formLoading = true
            saveCommissionRatio(this.postForm).then(res => {
              this.btnLoading = false
              this.formLoading = false
              this.$message.success('保存成功')
            }).catch(err => {
              this.btnLoading = false
              this.formLoading = false
              console.log(err)
            })
          } else {
          	this.btnLoading = false
            this.formLoading = false
            console.log('error submit!')
            return false
          }
        })
      }
    }
  }
</script>

<style scoped>
  .boder-bottom {
    border-bottom: 1px solid #eee;
    padding: 10px 0 10px 50px;
  }

  .boder-bottom label {
    display: inline-block;
    width: 300px;
    margin-right: 30px;
    text-align: right;
  }

  .boder-bottom div {
    line-height: 50px;
  }
</style>
